<template>
    <div class="mod-sys__user">
        <el-form :inline="true" :model="state.dataForm" @keyup.enter="getList()">
            <el-form-item label="专业名称">
                <el-input v-model="state.dataForm.name" placeholder="专业名称" clearable></el-input>
            </el-form-item>
            <el-form-item>
                <el-button @click="getList()">查询</el-button>
            </el-form-item>
            <el-form-item>
                <el-button v-if="state.hasPermission('sys:user:save')" type="primary"
                    @click="addOrUpdateHandle()">新增</el-button>
            </el-form-item>
        </el-form>
        <TableWrapper :valueData="pageList" :columns="columns" :optrations="optrations" @pageSize="pageSize"
            @currentPage="currentPage" :pageCurrent="{...pageCurrent,total}">
        </TableWrapper>
        <add-or-update ref="addOrUpdateRef" @refreshDataList="getList"></add-or-update>
    </div>
</template>

<script lang="ts" setup>
    import useView from "@/hooks/useView";
    import { reactive, ref, toRefs, onMounted } from "vue";
    import { ElMessage, ElMessageBox } from "element-plus";

    import baseService from "@/service/baseService";
    import TableWrapper from "@/components/table/TableWrapper.vue";
    import AddOrUpdate from "./user-add-or-update.vue";

    const view = reactive({
        getDataListIsPage: true,
    });
    const total = ref('0')
    const pageList = ref([])
    const pageCurrent = reactive({
        pageNum: '1',
        pageSize: 20
    })
    const columns = ref([
        {
            value: 'name',
            label: '专业名称'
        },
        {
            value: 'createDate',
            label: '创建时间'
        },
        {
            value: 'description',
            label: '专业介绍'
        },
    ])
    const optrations = [
        {
            name: '编辑',
            type: 'primary',
            icon: 'el-icon-plus',
            method: (columns, row) => {
                addOrUpdateHandle(row)
            },
            disabled: false
        },
        {
            name: '删除',
            type: 'danger',
            icon: 'el-icon-plus',
            method: (columns, row) => {
                ElMessageBox.confirm("确定进行[删除]操作?", "提示", {
                    confirmButtonText: "确定",
                    cancelButtonText: "取消",
                    type: "warning"
                })
                    .then(() => {
                        baseService
                            .delete("/cam/major/delete", {
                                id: row.id
                            })
                            .then((res) => {
                                ElMessage.success({
                                    message: "成功",
                                    duration: 500,
                                });
                                getList()
                            })
                    })
                    .catch(() => {
                        //
                    });
            },
            disabled: false
        }
    ]

    onMounted(() => {
        getList()
    });
    const getDataList = () => {
        getList()
    }
    const getList = () => {
        let param = {
            ...pageCurrent,
            query: {
                name: state.dataForm.name
            }
        };
        baseService
            .post("/cam/major/pageList", param)
            .then((res) => {
                if (res.code === 0) {
                    pageList.value = res.data.records
                    total.value = res.data.total
                } else {
                    ElMessage.error(res.msg);
                }
            })
            .catch(() => {
            });

    }

    const pageSize = (val) => {
        pageCurrent.pageSize = val
        getList()
    }
    const currentPage = (val) => {
        pageCurrent.pageNum = val
        getList()
    }
    const state = reactive({ ...useView(view), ...toRefs(view) });

    const addOrUpdateRef = ref();
    const addOrUpdateHandle = (row?: any) => {
        addOrUpdateRef.value.init(row);
    };
</script>